<template>
  <div class="defaultForm">
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="课程名称">
        <el-input v-model="course.data.courseName" disabled></el-input>
      </el-form-item>
      <el-form-item label="作业内容">
        <el-input v-model="form.content"></el-input>
      </el-form-item>
      <el-form-item label="提交时间">
        <el-col :span="11">
          <el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
        </el-col>
        <el-col class="line" :span="2">-</el-col>
        <el-col :span="11">
          <el-date-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-date-picker>
        </el-col>
      </el-form-item>
      <el-form-item label="上传文件" prop="url">
        <el-upload
          class="upload-demo"
          action
          :http-request="multipartUpload"
          :file-list="fileList2"
          list-type="picture"
        >
          <el-button size="small" type="primary">上传作业</el-button>
        </el-upload>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即创建</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { client } from "../../../util/alioss";
export default {
  data() {
    return {
      fileList2: [],
      course: [],
      form: {
        name: "",
        region: "",
        date1: "",
        date2: "",
        content: "",
        url: ""
      }
    };
  },
  created() {
    this.selectone();
  },
  methods: {
    selectone() {
      //alert(id);
      this.$axios
        .post("/selectone", {
          courseid: this.$route.params.courseid
        })
        .then(resp => {
          if (resp && resp.data.code === 200) {
            this.course = resp.data;
            console.log(this.course);
            console.log(this.course.data.courseid);
            console.log(this.course.data.courseName);
            return this.$message.success("查询成功");
          }
        })
        .catch(failResponse => {
          console.log(id);
          console.log(failResponse.responseResult);
          return this.$message.info("查询失败");
        });
    },
    async multipartUpload(file) {
      var fileName = "coursevide/" + file.file.uid + "/" + file.file.name;
      //定义唯一的文件名，打印出来的uid其实就是时间戳,/前为文件夹

      let result = client().multipartUpload(fileName, file.file);
      //let result= client().put(fileName, file.file);
      console.log(result);
      // console.log(res);
      this.form.url = "http://team6.oss-cn-beijing.aliyuncs.com/" + fileName;
      //console.log(this.addCouForm)
      console.log(this.form.url);
      //   this.$axios
    },
    onSubmit() {
      var that = this;
      if (1) {
        this.$axios
          .post("/teacher/work", {
            firsttime: this.form.date1,
            endtime: this.form.date2,
            coursename: this.course.data.courseName,
            worktext: this.form.content,
            courseid: this.$route.params.courseid,
            url: this.form.url
          })
          .then(resp => {
            if (resp && resp.data.code == 200) {
              console.log("成功");
              console.log(this.course.data.courseName);
              this.$message.info("申请成功!!!");
            }
          });
      } else {
        this.$message.fail("申请失败!!!");
        return false;
      }
    }
  }
};
</script>

<style scoped>
.defaultForm {
  width: 80%;
  height: 50%;
  margin: 0 auto;
}
</style>